<template>
  <div id="teamCardList" :style="[pageRoute==='pages/team/team'? 'height: calc(100vh - 108rpx)':'height:100vh']">
    <div class="scroll-begin">
      <scroll-view
      :scroll-top="scrollTop"
      scroll-y="true"
      class="scroll-Y"
      @scrolltoupper="upper"
      @scrolltolower="$emit('getMore')"
      @scroll="scroll"
    >
      <van-card
        v-for="team in props.teamList"
        :key="team.id"
        :desc="team.description"
        :thumb="team.url"
        :title="`${team.name} `"
      >
        <template #tags>
          <van-tag
            plain
            type="danger"
            style="margin-right: 8px; margin-top: 8px"
          >
            {{ teamStatusEnum[team.status] }}
          </van-tag>
        </template>
        <template #bottom>
          <div>
            {{ '最大人数' + team.maxNum }}
          </div>
          <div>
            {{ '过期时间' + team.expireTime }}
          </div>
          <div>
            {{ '创建时间' + team.createTime }}
          </div>
        </template>
        <template #footer>
          <van-button
            size="small"
            type="info"
            @click="doJoinTeam(team.id, team.status)"
            v-if="btnStatus === 0"
            >加入队伍</van-button
          >
          <slot :id="team.id"></slot>
        </template>
      </van-card>
    </scroll-view>

    </div>
    
  </div>
</template>

<script setup>
import { reactive, onUnmounted, onMounted, ref } from 'vue'
import { teamStatusEnum } from '../constant/TeamStatusEnum'
import useStore from '../store/index'
import { joinTeam } from '../api/team/team'
// const teamList=reactive([])
const props = defineProps({
  teamList: [],
})
let btnStatus = ref(0)
const scrollTop = ref(0)
const old = reactive({
  scrollTop: 0,
})
let pageRoute=ref('pages/team/team')//当前页路由
//队伍列表加入队伍
const doJoinTeam = async (id, teamStatus) => {
  if(uni.getStorageSync("Authorization")===null){
            uni.showToast({
              title:'请登录',
              icon:'none'
            })
            uni.switchTab({
              url:'/pages/person/person'
            })
            return false
          }
  console.log(111)

  const joinTeamObj = {
    teamId: id,
    password: '',
  }
  if (teamStatus === 2) {
    uni.showModal({
      title: '加入加密队伍',

      editable: true,
      placeholderText: '请输入密码',
      success:async (res) => {
        console.log(res.content)

        if (res.confirm) {
          console.log('用户点击确定')
          joinTeamObj.password = res.content
          const res1 = await joinTeam(joinTeamObj)
          if (res1.code === 0) {
            uni.showToast({
              title: '成功',
            })
            return
          } else {
          }
        } else if (res.cancel) {
          console.log('用户点击取消')
        }
      },
    })
  }else{
    const res1 = await joinTeam(joinTeamObj)
          if (res1.code === 0) {
            uni.showToast({
              title: '成功',
            })
            return
          }
  }


  
}
const scroll = (e) => {
  console.log('scroll:' + e)
  old.scrollTop = e.detail.scrollTop
}
onMounted(() => {
  // useStore().setting().btnStatusChange(1)
  console.log(useStore().setting().btnStatus)
  btnStatus.value = useStore().setting().btnStatus
  const currentPage= getCurrentPages()
  console.log(currentPage[0].route);
  pageRoute.value=currentPage[0].route
})
onUnmounted(() => {
  // useStore().setting().btnStatusChange(0)
})
</script>

<style scoped>
#teamCardList :deep(.van-image__img) {
  height: 128px;
  object-fit: unset;
}
.scroll-begin{
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}
.scroll-Y {
		flex: 1;
    height: 0px;
	}
</style>
